<template>
  <template v-if="reports && reports.length > 0">
    <div class="card" v-for="(item, index) in reports" :key="index">
      <ConsultationReport
          :info="{
          ...item,
          isApply: info.apply,
          reportStatus: info.reportStatus,
        }"
      />
    </div>
  </template>

  <van-empty v-else description="暂无数据"/>
</template>

<script lang="ts">
import {defineComponent} from "vue";
import ConsultationReport from "./ConsultationReport.vue";

export default defineComponent({
  name: "ConsultationReportList",
  components: {ConsultationReport},
  props: {
    info: Object,
  },
  data() {
    return {};
  },
  computed: {
    reports() {
      const info = this.info;
      const reports = info.reports ? info.reports : [];
      if (info.reportUrl !== null && info.reportUrl !== "") {
        reports.push({
          doctorPicUrl: info.doctorPicUrl,
          doctorName: info.doctorName,
          reportUrl: info.reportUrl,
          reportUrlName: info.reportUrlName,
          suggest: info.suggest,
          advice: info.advice,
          date: info.reportDate,
        });
      }
      return reports;
    },
  },
  watch: {},
  beforeCreate() {
  },
  created() {
  },
  beforeMount() {
  },
  mounted() {
  },
  beforeUpdate() {
  },
  updated() {
  },
  methods: {},
  beforeUnmount() {
  },
  unmounted() {
  },
});
</script>

<style scoped lang="scss">
.card {
  margin: 12px;
  padding: 12px;
  background: #fff;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  row-gap: 14px;
  align-items: start;
}
</style>
